<template>
	<view>
		<uni-card v-for="item in orders">
			<view v-for="it in item.orderItems">
				<!-- 订单-->
				<uni-card>
					<text>商品名称：{{it.name}}</text><br />
					<text>商品单价：{{it.price}}</text><br />
					<text>商品数量：{{it.number}}</text><br />
				</uni-card>
			</view>
			<text>共计支付：{{item.all}}
			</text><br />
			<text>交易时间：{{item.date}}</text><br />
			<text>交易人：{{item.username}}</text>
		</uni-card>
		<view class="position-sticky fixed-bottom">
			<button :plain="false" @click="back()">返回</button>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				orders: [{
					// username: '',
					// date: '',
					// all: '',
					// orderItems: [{
					// 	name: '',
					// 	price: '',
					// 	number: '',
					// }]
				}, ],
				username: uni.getStorageSync("token")
			}
		},
		methods: {
			back() {
				uni.reLaunch({  //使用reLaunch为了销毁其它页面，刷新购物车
					url:'user'
				})
			},
			onLoadOrder() {
				/* 加载订单 */
				uni.request({
					url: 'http://localhost:8081/order/selectOrder',
					success: (res) => {
						for (let item in res.data.order) {
							if (res.data.order[item].username == this.username) {
								// console.log("订单数量："+item)
								this.orders.unshift(res.data.order[item]);  //向前追加
							}
						}
						this.orders.pop();//最后一个元素是无用的，需要删除
					}
				})
			},

		},
		computed: {

		},
		onLoad() {
			this.onLoadOrder(); //页面创建时，加载订单信息
		}
	}
</script>

<style>
	.small {
		font-size: small;
	}

	.position-sticky {
		position: -webkit-sticky !important;
		position: sticky !important;
	}

	.fixed-bottom {
		position: fixed;
		right: 0;
		bottom: calc(var(--window-bottom) + 3px);
		left: 0;
		z-index: 1030;
		margin-bottom: 6;
		text-align: right;
		margin-right: 30rpx;
	}
</style>
